<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>汉服荟商城</title>
<!--导入核心文件-->
<script src="../bootstrap3/js/holder.js"></script>
<link href="../bootstrap3/css/bootstrap.css" rel="stylesheet"
	type="text/css">
<script src="../bootstrap3/jquery-1.9.1.min.js"></script>
<script src="../bootstrap3/js/bootstrap.js"></script>
<link href="../css/addAddress.css" rel="Stylesheet" />
<script src="../js/aaa.js"></script>
<script src="../bootstrap3/js/jquery.cookie.js" type="text/javascript" charset="utf-8"></script>
<!-- 字体图标 -->
<link rel="stylesheet"
	href="../bootstrap3/font-awesome-4.7.0/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="../css/layout.css" />
</head>
<body>
	<!--头部-->
	<div class="s_nav">
		<div class="s_nav_box">
			<a class="s_logo photo" href="../index.html"></a>
			<nav class="s_nav_menu">
				<a class="default active" href="../index.html">首页</a> <a
					class="album" href="album.html">摄影</a> <a class="video"
					href="/video">视频</a> <a class="topic" href="/topic">问答</a> <a
					class="word" href="/word">文章</a> <a class="activity" href="/game">活动</a>
			</nav>
			<div class="def_search  header_user">

				<div class="user">
					<img class="head" id="myavatar"
						src="https://pic.hanfugou.com/web/2018/11/20/11/2e3e6efa17ba4116941bd3d176ddc8df.jpeg_50x50.jpg">
					<nav class="dropdown_menu">
						<a class="item letter" href="password.html" target="im"> <i
							class="icon"></i>修改密码
						</a> <a class="item auth" href="userdata.html"> <i class="icon"></i>个人资料
						</a> <a href="upload.html" id="aUMain" class="item usermain"> <i
							class="icon"></i>上传头像
						</a> <a class="item tools" href="address.html"> <i class="icon"></i>收货管理
						</a> <a class="item exit" href="login.html"><i class="icon"></i>退出
						</a>
					</nav>
				</div>


				<div class="appdown">
					APP下载
					<div class="appdownload">
						<div class="appdownload_btn">
							<a class="ios"
								href="https://itunes.apple.com/cn/app/id1065807878"
								target="_blank">iPhone下载</a> <a class="android"
								href="https://www.hanfuhui.cn/download" target="_blank">Android下载</a>
						</div>
						<img id="img-avatar"
							src="../image/2e3e6efa17ba4116941bd3d176ddc8df.jpeg_100x100.jpg"
							alt="">
					</div>
				</div>
				<a class="search_btn" onclick="location.href='/search'"></a>
			</div>
		</div>
	</div>
	<!--头部结束-->
	<!--导航 -->
	<!--分割导航和顶部-->
	<div class="clearfix"></div>
	<div class="col-md-12 top-nav">
		<div class="col-md-6">
			<ul class="nav nav-pills">
				<li><a href="#"></a></li>
				<li class="active"><a href="index.html"><span
						class="fa fa-home"></span></a></li>
				<li><a class="gou" href="han_shopmall.html">商城</a></li>
				<li><a href="cart.html">购物车<span class="messcount"></span></a></li>
				<li><a href="news.html">资讯</a></li>
				<li><a href="culture.html">文化</a></li>
			</ul>

		</div>
		<div class="col-md-6">

			<form action="search.html" class="form-inline" role="form"
				style="float: right;">
				<div class="form-group">
					<input type="text" class="form-control" id="search" name="search"
						placeholder="请输入商品名称进行搜索">
				</div>

				<button type="submit" class="btn btn-default btn-sm">
					<span class="fa fa-search"></span>
				</button>
			</form>

		</div>
	</div>
	<!--导航结束-->
	<div id="container">
		<div class="col-md-2">
			<!--左侧导航开始-->
			<div class="panel-group" id="accordion">
				<div class="panel panel-default">
					<div class="panel-heading">
						<!--主选项：我的订单-->
						<h4 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion"
								href="#collapseOne">我的订单</a>
						</h4>
					</div>
					<div id="collapseOne" class="panel-collapse collapse">
						<div class="panel-body">
							<div>
								<a href="orders.html">全部订单</a>
							</div>
							<div>
								<a href="orders.html">待付款</a>
							</div>
							<div>
								<a href="orders.html">待收货</a>
							</div>
							<div>
								<a href="orders.html">待评价</a>
							</div>
							<div>
								<a href="orders.html">退货退款</a>
							</div>

						</div>
					</div>

				</div>
				<div class="panel panel-default">
					<div class="panel-heading">
						<!--主选项：资料修改-->
						<h4 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion"
								href="#collapseTwo">资料修改</a>
						</h4>
					</div>
					<div id="collapseTwo" class="panel-collapse collapse in">
						<div class="panel-body">
							<div>
								<a href="password.html">修改密码</a>
							</div>
							<div>
								<a href="userdata.html">个人资料</a>
							</div>
							<div>
								<a href="upload.html">上传头像</a>
							</div>
							<div>
								<a href="address.html"><b>收货管理</b></a>
							</div>
						</div>
					</div>
				</div>

			</div>
			<!--左侧导航结束-->

		</div>
		<div class="col-md-10">
			<div class="panel panel-default">
				<ul class="nav nav-tabs">
					<li><a href="password.html">修改密码</a></li>
					<li><a href="userdata.html">个人资料</a></li>
					<li><a href="upload.html">上传头像</a></li>
					<li class="active"><a href="#">收货管理</a></li>

				</ul>
				<div class="panel-body">
					<!--新增收货地址表单开始-->
					<form id="form-address" class="form-horizontal" role="form">
						<div class="form-group">
							<label class="col-md-2 control-label"><span
								style="color: red;">*</span>收货人：</label>
							<div class="col-md-8">
								<input name="name" type="text" class="form-control"
									placeholder="请输入收货人姓名">
							</div>
						</div>
						<div class="address_content" data-toggle="distpicker">
							<div class="form-group">
								<label class="col-md-2 control-label"><span
									style="color: red;">*</span>省/直辖市：</label>
								<div class="col-md-3">
									<select name="province" class="form-control"
										data-province="---- 选择省 ----" id="provinces">
										<option value="0">--- 请选择 ---</option>
									</select>
								</div>
								<label class="col-md-2 control-label"><span
									style="color: red;">*</span>城市：</label>
								<div class="col-md-3">
									<select name="city" class="form-control"
										data-city="---- 选择市 ----" id="cities">
										<option value="0">--- 请选择 ---</option>
									</select>
								</div>
							</div>
							<div class="form-group">
								<label class="col-md-2 control-label"><span
									style="color: red;">*</span>区县：</label>
								<div class="col-md-3">
									<select name="area" class="form-control"
										data-district="---- 选择区 ----" id="areas">
										<option value="0">--- 请选择 ---</option>
									</select>
								</div>
								<label class="col-md-2 control-label">邮政编码：</label>
								<div class="col-md-3">
									<input name="zip" type="text" class="form-control"
										placeholder="请输入邮政编码">
								</div>
							</div>
						</div>
						<div class="form-group">
							<label class="col-md-2 control-label"><span
								style="color: red;">*</span>详细地址：</label>
							<div class="col-md-8">
								<textarea name="address" class="form-control" rows="3"
									placeholder="输入详细的收货地址，小区名称、门牌号等"></textarea>
							</div>
						</div>
						<div class="form-group">
							<label class="col-md-2 control-label"><span
								style="color: red;">*</span>手机：</label>
							<div class="col-md-3">
								<input name="phone" type="text" class="form-control"
									placeholder="请输入手机号码">
							</div>
							<label class="col-md-2 control-label">固话：</label>
							<div class="col-md-3">
								<input name="tel" type="text" class="form-control"
									placeholder="请输入固定电话号码">
							</div>
						</div>

						<div class="form-group">
							<label class="col-md-2 control-label">地址类型：</label>
							<div class="col-md-8">
								<input name="tag" type="text" class="form-control"
									placeholder="请输入地址类型，如：家、公司或者学校">
							</div>
						</div>
						<div class="form-group">

							<label class="col-md-2 control-label"><a
								href="address.html">返回</a>&nbsp;&nbsp;&nbsp;</label>

							<div class="col-sm-10">
								<input id="btn-submit" type="button"
									class="col-md-1 btn btn-primary" value="保存" /> <input
									type="reset" class="col-md-offset-1 col-md-1 btn btn-primary"
									value="重置" />
							</div>
						</div>
					</form>
				</div>
			</div>

		</div>
	</div>
	<!--页脚开始-->
	<footer style="text-align: center;">
		<p>
			<a href="/" target="_blank">关于我们</a><i>|</i><a href="/"
				target="_blank">商家入驻</a><i>|</i><a href="/" target="_blank">入驻协议</a><i>|</i><a
				href="#" target="_blank">新手指南</a><i>|</i><a
				href="/copyright/?action=cooperation" target="_blank">商务合作</a><i>|</i><a
				href="" target="_blank">汉服荟</a>
		</p>
		<p class="copyright">
			<a href="/" class="ebs" target="_blank"></a>CopyRight ©2018
			珠海市达内汉服网络科技有限公司 版权所有 <a href="" target="_blank">粤ICP备14084884号-1</a>
			电话：0888-8888888
		</p>
	</footer>
	<!--页脚结束-->
	<script type="text/javascript">
			// 加载省的列表
			function getProvinceList() {
				// 清空当前列表
				$("#provinces").empty();
				// 添加默认选项
				var op = '<option value="0">--- 请选择 ---</option>';
				$("#provinces").append(op);

				// 将请求提交到哪里
				var url = "../district/list/86";
				// 发出ajax请求，并处理结果
				$.ajax({
					"url" : url,
					"type" : "POST",
					"dataType" : "json",
					"success" : function(json) {
						// 遍历加载新列表项
						var list = json.data;
						for (var i = 0; i < list.length; i++) {
							console.log(list[i].code + " - " + list[i].name);
							op = '<option value="' 
						+ list[i].code + '">'
									+ list[i].name + '</option>';
							$("#provinces").append(op);
							// <select>
							// 		<option value="1">第1项</option>
							// 		<option value="2">第2项</option>
							// 		<option value="3">第3项</option>
							// </select>
						}
					}
				});
			}

			// 加载市的列表
			function getCityList() {
				// 清空当前列表
				$("#cities").empty();
				// 添加默认选项
				var op = '<option value="0">--- 请选择 ---</option>';
				$("#cities").append(op);

				// 获取所选择的省
				var code = $("#provinces").val();

				// 判断省的代号的值
				if (code == 0) {
					return;
				}
				// 将请求提交到哪里
				var url = "../district/list/" + code;
				// 发出ajax请求，并处理结果
				$.ajax({
							"url" : url,
							"type" : "POST",
							"dataType" : "json",
							"success" : function(json) {
								// 遍历加载新列表项
								var list = json.data;
								for (var i = 0; i < list.length; i++) {
									console.log(list[i].code + " - "
											+ list[i].name);
									var op = '<option value="' 
						+ list[i].code + '">'
											+ list[i].name + '</option>';
									$("#cities").append(op);
								}
							}
						});
			}

			// 加载区的列表
			function getAreaList() {
				// 清空当前列表
				$("#areas").empty();
				// 添加默认选项
				var op = '<option value="0">--- 请选择 ---</option>';
				$("#areas").append(op);

				// 获取所选择的市
				var code = $("#cities").val();

				// 判断市的代号的值
				if (code == 0) {
					return;
				}

				// 将请求提交到哪里
				var url = "../district/list/" + code;
				// 发出ajax请求，并处理结果
				$.ajax({
							"url" : url,
							"type" : "POST",
							"dataType" : "json",
							"success" : function(json) {
								// 遍历加载新列表项
								var list = json.data;
								for (var i = 0; i < list.length; i++) {
									console.log(list[i].code + " - "
											+ list[i].name);
									var op = '<option value="' 
						+ list[i].code + '">'
											+ list[i].name + '</option>';
									$("#areas").append(op);
								}
							}
						});
			}

			// 当页面加载完成时
			$(document).ready(function() {
                	//头像加载
                    if ($.cookie("avatar") != null) {
                        var c=$.cookie("avatar");
                        console.log(c);
                        $("#img_avatar").attr("src", $.cookie("avatar"));
                        $("#myavatar").attr("src", $.cookie("avatar"));
                    }

				// 加载省的列表
				getProvinceList();
                //清空当前列表
                $("#areas").empty();
                var op = '<option value="0">---请选择---</option>';
                $("#areas").append(op);
				// 为省的列表绑定change事件
				$("#provinces").change(function() {
					// 加载市的列表
					getCityList();
                    //清空当前列表
                    $("#areas").empty();
                    var op = '<option value="0">---请选择---</option>';
                    $("#areas").append(op);

                    // 为市的列表绑定change事件
                    $("#cities").change(function() {
                        // 加载区的列表
                        getAreaList();
                    });
				});
			});

			// 为提交按钮绑定单击事件
			$("#btn-submit").click(function() {
				// 检查提交的数据
				if ($("#provinces").val() == 0) {
					alert("错误！请选择省！");
					return;
				}
				if ($("#cites").val() == 0) {
					alert("错误！请选择市！");
					return;
				}
				if ($("#areas").val() == 0) {
					alert("错误！请选择区！");
					return;
				}

				// 将请求提交到哪里
				var url = "../address/create";
				// 请求参数
				var data = $("#form-address").serialize();
				console.log("收货地址参数：" + data);
				// 发出ajax请求，并处理结果
				$.ajax({
					"url" : url,
					"data" : data,
					"type" : "POST",
					"dataType" : "json",
					"success" : function(json) {
						if (json.state == 200) {
							alert("保存成功！");
						} else {
							alert(json.message);
						}
					},
					"error" : function(xhr, text, errorThrown) {
						console.log("xhr.status=" + xhr.status);

						alert("您的登录信息已经过期！请重新登录！");
						location.href = "login.html";
					}
				});
			});
		</script>
</body>

</html>